.my .header {
  background: url(../../assets/images/190819_1j85g48lc84kk8deg00f66fk53dlc_750x229.png) 0 -0.44rem no-repeat;
  background-size: 100%;
  overflow: hidden;
  margin-bottom: .18rem;
  height: 4.56rem;
}

.my .header .header-box {
  margin: 1.2rem auto 0;
  height: 3.36rem;
  width: 9.36rem;
  border-radius: .12rem;
  background: #fff;
  position: relative;
}

.my .header .header-box .link .user-wrap {
  position: absolute;
  left: 50%;
  top: -.66rem;
  z-index: 98;
  margin-left: -.66rem;
  width: 1.733333rem;
  height: 1.733333rem;
  border: .06rem solid #fff;
  border-radius: 100%;
  overflow: hidden;
}

.my .header .header-box .link .user-wrap .user-img {
  width: 100%;
  border: none;
  vertical-align: middle;
}

.my .header .header-box .link .user-info {
  width: 9.36rem;
  text-align: center;
  padding-top: 1.28rem;
}

.my .header .header-box .link .user-info .user-name {
  line-height: .42rem;
  font-weight: 700;
  font-size: .34rem;
  display: flex;
  -webkit-box-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  align-items: center;
}

.my .header .header-box .link .user-member {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 9.36rem;
  height: 1.44rem;
  background: url(https://s10.mogucdn.com/mlcdn/c45406/191010_2il1l3i91gkd5c461j93e5ehfcgi5_1404x216.png) no-repeat;
  background-size: 100%;
  border-bottom-left-radius: .12rem;
  border-bottom-right-radius: .12rem;
}

.my .banner {
  margin: 0 auto;
  width: 9.36rem;
  border-radius: .12rem;
  background: #fff;
  margin-bottom: .18rem;
  height: 1.866667rem;
}

.my .banner .banner-box {
  padding: .1rem;
  display: flex;
  -webkit-box-pack: start;
  justify-content: start;
  flex-wrap: wrap;
}

.my .banner .banner-box .box {
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  width: 1.333333rem;
  margin: 0.133333rem .18rem;
}

.my .banner .banner-box .box .img-wrap {
  position: relative;
  width: 0.666667rem;
  height: 0.666667rem;
  margin: .06rem;
}

.my .banner .banner-box .box .img-wrap img {
  width: 100%;
}

.my .carts {
  margin: 0 auto;
  width: 9.36rem;
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  margin-bottom: .18rem;
}

.my .carts .carts-box {
  width: 9.36rem;
}

.my .carts .carts-box .box-left {
  background: url(https://s10.mogucdn.com/mlcdn/c45406/190815_3637hh8ac09e50j7f07i7eealck4i_513x360.png) 0px 0px/170px no-repeat;
  width: 4.586667rem;
  height: 3.2rem;
  float: left;
  border-radius: .12rem;
  overflow: hidden;
  padding: .2rem .24rem;
}

.my .carts .carts-box .box-left .left-text {
  font-size: 0.32rem;
  color: #333;
}

.my .carts .carts-box .box-right {
  width: 4.56rem;
  height: 3.2rem;
  background: #fff;
  border-radius: .12rem;
  overflow: hidden;
  float: right;
}

.my .carts .carts-box .box-right .right-item {
  display: flex;
  -webkit-box-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  align-items: center;
  width: 3.92rem;
  height: 1.066667rem;
  margin: 0 auto;
  border-bottom: .01rem solid #efefef;
}

.my .carts .carts-box .box-right .right-item .item-left {
  font-size: 0.373333rem;
  color: #333;
}

.my .carts .carts-box .box-right .right-item .item-right {
  font-size: .22rem;
  color: #999;
  -webkit-box-align: center;
  align-items: center;
  display: flex;
  line-height: 1;
}

.my .carts .carts-box .box-right .right-item .item-right img {
  height: 0.24rem;
  width: 0.133333rem;
  margin-left: .07rem;
  border: none;
  vertical-align: middle;
}

.my .order {
  margin: 0 auto;
  width: 9.36rem;
  border-radius: .12rem;
  background: #fff;
  margin-bottom: .18rem;
  height: 2.906667rem;
}

.my .order .order-box .box-top {
  margin: 0 auto;
  width: 8.72rem;
  height: 1.066667rem;
  line-height: 1.066667rem;
  overflow: hidden;
  border-bottom: .01rem solid #efefef;
}

.my .order .order-box .box-top .top-left {
  float: left;
  font-size: 0.373333rem;
  color: #333;
}

.my .order .order-box .box-top .top-right {
  float: right;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  color: #999;
  font-size: .22rem;
}

.my .order .order-box .box-top .top-right img {
  height: 0.24rem;
  width: 0.133333rem;
  margin-left: .07rem;
  border: none;
  vertical-align: middle;
}

.my .order .order-box .box-contents {
  padding: .1rem;
  display: flex;
  -webkit-box-pack: start;
  justify-content: start;
  flex-wrap: wrap;
}

.my .order .order-box .box-contents .contents {
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: column;
  -webkit-box-align: center;
  align-items: center;
  width: 1.333333rem;
  margin: .1rem 0.24rem;
}

.my .order .order-box .box-contents .contents .img {
  position: relative;
  width: 0.666667rem;
  height: 0.666667rem;
  margin: .06rem;
}

.my .order .order-box .box-contents .contents .img img {
  width: 100%;
}

.my .btn {
  display: block;
  width: 9.36rem;
  height: 1.066667rem;
  line-height: 1.066667rem;
  color: #fff;
  background-color: #ff5777;
  font-size: .3rem;
  margin: 0 auto;
  border-radius: .04rem;
  text-align: center;
  margin-bottom: .18rem;
  border: 0;
}
